<script setup>
import useDragAndDrop from './useDnD';

const { onDragStart } = useDragAndDrop()
</script>

<template>
  <aside style="min-inline-size: 170px;">

    <div class="nodes">
      <div class="vue-flow__node-input" style="    margin-block: 8px;    margin-inline: 0;" :draggable="true" @dragstart="onDragStart($event, 'input')">Input Node</div>

      <div class="vue-flow__node-default" style="    margin-block: 8px;    margin-inline: 0;" :draggable="true" @dragstart="onDragStart($event, 'default')">Default Node</div>

      <div class="vue-flow__node-output" style="    margin-block: 8px;    margin-inline: 0;" :draggable="true" @dragstart="onDragStart($event, 'output')">Output Node</div>
    </div>
  </aside>
</template>
